<!-- 租户管理页面 -->
<template>
  <div class="tenant-index" v-loading="tenantLoading">
    <!-- <div class="domain">
      <el-input
        placeholder="输入关键字进行过滤"
        size="mini"
        v-model="searParams.domainId"
        style="margin-bottom: 10px"
      >
        <i slot="prefix" class="el-input__icon el-icon-search"></i>
      </el-input>
      <el-tree
        class="filter-tree"
        :data="domainList"
        :props="defaultProps"
        default-expand-all
        :filter-node-method="filterNode"
        ref="tree"
      >
      </el-tree>
    </div> -->
    <div class="tenant">
      <!-- <div class="domain-sear" v-if="isShowSear">
        <el-form size="mini" inline>
          <el-form-item label="关键字">
            <el-input
              placeholder="关键字检索(名称/授权标识)"
              v-model="searParams.keyword"
            ></el-input>
          </el-form-item>
          <el-form-item label="创建人">
            <el-select
              v-model="searParams.createBy"
              size="mini"
              clearable
              placeholder="请选择"
            >
              <el-option
                v-for="item in createTenantList"
                :key="item.id"
                :label="item.username"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="创建时间">
            <el-date-picker
              v-model="createDate"
              style="width: 300px"
              size="mini"
              type="datetimerange"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              align="center"
              @change="handleSelectDate"
            >
            </el-date-picker>
          </el-form-item>
          <el-button size="mini" type="primary">查询</el-button>
          <el-button size="mini">重置</el-button>
        </el-form>
      </div> -->
      <!-- <div class="tenant-oper">
        <div class="tenant-oper-left">
          <el-button
            type="primary"
            size="mini"
            plain
            icon="el-icon-plus"
            v-if="innerMenu.add.flag"
            >新增</el-button
          >
          <el-button
            type="success"
            size="mini"
            plain
            icon="el-icon-edit"
            v-if="innerMenu.upd.flag"
            >修改</el-button
          >
          <el-button
            type="danger"
            size="mini"
            plain
            icon="el-icon-delete"
            v-if="innerMenu.del.flag"
          >
            删除</el-button
          >
          <el-button size="mini" plain icon="el-icon-sort">展开/折叠</el-button>
        </div>
        <div class="tenant-oper-right">
          <el-button
            icon="el-icon-search"
            size="mini"
            circle
            @click="isShowSear = !isShowSear"
          ></el-button>
          <el-button
            icon="el-icon-refresh"
            size="mini"
            circle
            @click="list()"
          ></el-button>
        </div>
      </div> -->
      <el-table :data="tenantList" style="width: 100%">
        <el-table-column prop="username" label="用户名"> </el-table-column>
        <el-table-column prop="nickname" label="昵称"> </el-table-column>
        <el-table-column label="状态"> </el-table-column>
        <!-- <el-table-column prop="phone" label="手机号码"> </el-table-column>
        <el-table-column prop="email" label="邮箱"> </el-table-column>
        <el-table-column prop="idCard" label="身份证"> </el-table-column> -->
      </el-table>
      <!-- <el-pagination
        class="page"
        background
        layout="total, sizes, prev, pager, next, jumper"
        :total="tenantPage.totalCount"
        :page-sizes="[5, 10, 20, 50]"
        :page-size="tenantPage.pageSize"
        @current-change="handleModifyOffset"
        @size-change="handleModifyLimit"
      >
      </el-pagination> -->
    </div>
  </div>
</template>

<script>
import { getCacheInnerMenu } from "@/utils/menu";
export default {
  props: {
    tenantList: {
      type: Array,
      require: true,
    },
    tenantLoading: {
      type: Boolean,
      default: false,
    },
  },
  watch: {
    // searParams(val) {
    //   this.$refs.tree.filter(val);
    // },
  },
  data() {
    return {
      isShowSear: true,
      searParams: {},
      createTenantList: [],
      createDate: [],
      domainList: [],
      filterText: "",
      defaultProps: {
        children: "children",
        label: "name",
      },
      tenantPage: [],
      innerMenu: {},
    };
  },
  created() {
    this.resetSearParams();
    this.getDomains();
    // this.list();
    this.innerMenu = getCacheInnerMenu(this.$route.meta.id);
    console.log(this.innerMenu);
  },
  mounted() {},
  methods: {
    /**
     * 重置检索菜单
     */
    resetSearParams() {
      this.searParams = {
        offset: 1,
        limit: 5,
        keyword: "",
      };
    },
    /**
     * 重置搜索参数
     */
    handleResetSearParams() {
      this.resetSearParams();
    },
    /**
     * 页码改变
     */
    handleModifyOffset(offset) {
      this.searParams.offset = offset;
      // this.list();
    },
    /**
     * 页数改变
     */
    handleModifyLimit(limit) {
      this.searParams.limit = limit;
      // this.list();
    },
    /**
     * 查询租户列表
     */
    // list() {
    //   this.$store.dispatch("tenant/listInAuth", this.searParams).then((res) => {
    //     console.log(res);
    //     if (res.code === 0) {
    //       if (res.data != null) {
    //         this.tenantPage = res.data;
    //       }
    //     }
    //   });
    // },
    /**
     * 过滤区域
     */
    filterNode(value, data) {
      if (!value) return true;
      return data.name.indexOf(value) !== -1;
    },
    /**
     * 选择时间
     */
    handleSelectDate() {},
    /**
     * 获取区域列表
     */
    getDomains() {
      this.$store.dispatch("domain/list", this.searParams).then((res) => {
        if (res.code === 0) {
          this.domainList = res.data;
        }
      });
    },
  },
};
</script>
<style scoped>
/* @import url(); 引入css类 */
.tenant-index {
  height: auto;
  margin: 1%;
  margin-top: 0;
  margin-left: 0;
  /* display: flex; */
}

.domain {
  flex: 0.15;
}

.tenant {
  flex: 0.8;
  /* margin-left: 15px; */
}

.page {
  text-align: center;
  margin-top: 15px;
}

.tenant-oper {
  margin: 0 0 12px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
</style>
